<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>启动流程</title>
    <#include "/pubHeadStyleTree.html">
    <script src="${ctx}/formStatic/verify.js"></script>
    <script src="${ctx}/formStatic/form/form.js"></script>
    <script src="${ctx}/formStatic/form/CommonDialog.js" type="text/javascript"></script>
</head>
<body>
<script src="${ctx}/formStatic/verify.js"></script>
<script src="${ctx}/formStatic/form/form.js"></script>
<script src="${ctx}/formStatic/form/CommonDialog.js" type="text/javascript"></script>
<form id="frmWorkFlow" lay-filter="frmWorkFlow"  class="layui-form" action="" style="overflow: auto;height: 100%;">
    <input type="hidden" include="1" name="curUserId" value="${curUserId}"/>
    <input type="hidden" include="1" name="tenantId" value="${tenantId}"/>
    <input type="hidden" include="1" name="curUserName" value="${curUserName}"/>
    <input type="hidden" include="1" name="procDefId" value="${actDefModel.procDefId}"/>
    <input type="hidden" include="1" name="modelId" value="${actDefModel.id}"/>
    <input type="hidden" include="1" name="businessKey" value="${businessKey}"/>
    <input type="hidden" include="1" name="reRunId" value="${runId}" />
    <input type="hidden" include="1" id="startNode" name="startNode" />
    <input type="hidden" include="1" id="nodeUserAssignee" name="nodeUserAssignee" />
    <#if paraMap??>
        <#list paraMap as item>
            <input type="hidden" include="1" name="${item.key}" value="${item.value}" />
        </#list>
    </#if>
    <div>
        <div class="noprint commonDiv topHeight">
            <#include "/workflow/task/incToolBarStart.html">
        </div>
        <div class="noprint commonDiv topHeight">
            <b>流程简述：</b>${actDefModel.description}
        </div>

        <div class="commonDiv printForm" style="overflow: auto;">

            <#if isMultipleFirstNode?? && isMultipleFirstNode>
                <div class="flowNodeList">
                    <table class="table-grid">
                        <thead>
                        <tr>
                            <th height="28" width="20%">起始路径选择</th>
                            <td>
                                <#list flowNodeList as flowNode>
                                <lable>${flowNode.nodeName}<input type="radio" name="flowNode" value="${flowNode.nodeId}" /></lable>
                            </#list>
                            </td>
                        </tr>
                        </thead>
                    </table>
                </div>
            </#if>

            <#if actDefModel.showFirstAssignee==1>
                <div id="jumpDiv" class="noprint" style="display:none;" tipInfo="正在加载表单请稍候..."></div>
            </#if>

            <#if param.relRunId??>
                <div class="noprint">
                </div>
            </#if>

            <#if isFormEmpty>
                <div class="noForm">没有设置流程表单。</div>
            <#else>
                <#if isExtForm>
                    <div id="divExternalForm" formKey="${form}"></div>
                <#else>
                    <div class="panel-detail" id="customFormDiv"></div>
                    <input type="hidden" include="1" name="formKey" value="${formKey}"/>
                </#if>
            </#if>
        </div>
    </div>
</form>
<style>
    @media print {
        .noprint{display:none;}
        .printForm{display:block !important;}
        .noForm{font-size: 14px;font-weight: bold;text-align: center;}
    }

    .commonDiv{
        padding:10px 10px 0px 10px;
    }
    .btn-close .layui-layer-btn{
        text-align: center;
    }
    .btn-close .layui-layer-btn a{
        display: inline-block;
        height: 38px;
        line-height: 38px;
        padding: 0 18px;
        background-color: #FF5722;
        color: #fff;
        white-space: nowrap;
        text-align: center;
        font-size: 14px;
        border: none;
        border-radius: 2px;
        cursor: pointer;
    }

    .layui-input-block{
        margin-left: 0 !important;
    }

</style>


<script>
    layui.config({
        base: serverPath.systemPath + staticPath.formPath //静态资源所在路径
    }).extend({
        index: 'index' //主入口模块
    }).use(['index','element', 'table', 'setter', 'util', 'form','layer','jquery', 'commons'], function () {
        var element = layui.element,
            table=layui.table,
            setter=layui.setter,
            form = layui.form,
            $ = layui.jquery,
            commons = layui.commons,
            layer = layui.layer;

        var isExtForm="${isExtForm}";
        var isFormEmpty="${isFormEmpty}";
        var isNeedSubmitConfirm="${actDefModel.submitConfirm==1}";
        var bpmGangedSets=[];
        var hasLoadComplete=false;
        var procDefId="${actDefModel.procDefId}";
        var modelId="${actDefModel.id}";
        var runId = "${runId}";

        var frmWorkFlow = $("#frmWorkFlow");
        if(isFormEmpty) return;
        if(isExtForm){
            var formKey=$('#divExternalForm').attr("formKey");
            var data = {
                formKey: formKey,
                procDefId:procDefId,
                businessKey:"${businessKey}"
            };

            $.ajax({
                type:"post",
                url:serverPath.workflowPath  + setter.workflowLinkPath + "task/addPermissionToUrlForm",
                data:data,
                dataType:"json",
                success:function (result) {
                    var html = result.data;
                    $("#divExternalForm").append(html);
                }
            });
        }else{
            $("#customFormDiv").load( serverPath.formPath + "${form}");
        }
        var obj=$('#jumpDiv');
        var url=  serverPath.workflowPath  + setter.workflowLinkPath + "task/view/tranTaskUserMap?selectPath=0&isStart=1&procDefId="+procDefId;
        obj.html(obj.attr("tipInfo")).show().load(url);
        $(".assignUser").click(function () {
            if (isFormEmpty) {
                layer.alert("没有设置流程表单,无法设置指定执行人！",{icon: 0,
                    skin: 'layui-layer-orange'});
                return
            }
            var dataPrivacyLevel = $("select[name^='m:'][name$='dataPrivacyLevel']").val();
            layer.open({
                type: 2,
                title: "选择执行人",
                shade: 0.3,
                left: 200,
                area: ['50%', '65%'],
                content:serverPath.workflowPath + setter.workflowLinkPath +'actDefModel/view/flowUserHistory?procDefId=' + procDefId + "&dataPrivacyLevel=" + dataPrivacyLevel
            });
        });

        window.callback = function (selUserInfo) {
            $("#nodeUserAssignee").val(selUserInfo);
        };

        function setFormData(data){
            if (isExtForm) {
                var checkBoxObject = new Object();
                $("#frmWorkFlow form input[type='checkbox']").each(function(){
                    var b = $(this).next().hasClass("layui-form-checked");
                    if(b){
                        if(!checkBoxObject[$(this).prop("name")]){
                            checkBoxObject[$(this).prop("name")] =$(this).val();
                        }else{
                            checkBoxObject[$(this).prop("name")] +=","+$(this).val();
                        }
                    }
                });
                for (var item in checkBoxObject){
                    data.field[item]=checkBoxObject[item];
                }
            }else{
                data.field.formData = getData();
            }
        };
        form.on('submit(run)', function(data){
            if (isFormEmpty) {
                layer.alert("没有设置流程表单,无法启动流程！",{icon: 0,
                    skin: 'layui-layer-orange'});
                return
            }
            var flowNodes = $("input[name='flowNode']");
            if(flowNodes!=undefined && flowNodes.length>1){
                var flowNode = $("input[type='radio']:checked");
                if(flowNode.length!=1){
                    layer.msg('请选择一个跳转节点!');
                    return false;
                }
            }
            var rtn=beforeClick(1);
            if( rtn==false){
                return false;
            }
            setFormData(data);
            $.ajax({
                url: serverPath.workflowPath + setter.workflowLinkPath + "task/startFlow?runId="+runId,
                type: "post",
                dataType: 'json',
                data:data.field,
                success: function (result) {
                    showResponse(result,1);
                }
            });
            return false;
        });
        $(".flowDesign").click(function () {
            if (isFormEmpty) {
                layer.alert("没有设置流程表单,无法查看流程图！",{icon: 0,
                    skin: 'layui-layer-orange'});
                return
            }
            layer.open({
                type: 2,
                title: "流程图",
                shade: 0.3,
                left: 200,
                area: ['50%', '60%'],
                btn:['关闭'],
                skin: 'btn-close',
                content: serverPath.workflowPath + setter.workflowLinkPath + 'bpmnImage/view/diagram?modelId=' + modelId
            });
        });
        $(".reset").click(function () {
            if($('#divExternalForm form')[0]){
                $('#divExternalForm form')[0].reset();
            };
            if($('#customFormDiv form')[0]){
                $('#customFormDiv form')[0].reset();
                var formEdit=$('#customFormDiv form')[0];
                for (var i=0;i<formEdit.length;i++){
                    var element = formEdit[i];
                    var tagName = element.tagName;
                    var type = element.type;
                    if("INPUT"===tagName){
                        if("text"===type){
                            element.value="";
                            if(element.attributes.ids){
                                element.attributes.ids.value="";
                            }
                        };
                        if("file"===type){
                            if(element.nextElementSibling && element.nextElementSibling.tagName=="UL"){
                                element.nextElementSibling.innerHTML=""
                            }
                        };
                        if("hidden"===type){
                            if(element.previousElementSibling && element.previousElementSibling.tagName=="SPAN"){
                                element.previousElementSibling.innerHTML="请选择";
                            }
                        };
                        if("radio"===type){
                            if(element.attributes.checked){
                                element.attributes.checked.value="";
                            }
                        };
                    }else if("TEXTAREA"===tagName){
                        element.innerHTML="";
                    };
                };
            };
            form.render();
        });

        function showResponse(result,type) {
            if (result.code === 0) {
                layer.alert(result.msg,function(index){
                    layer.close(index);
                    var rtn=afterClick(type);
                    if(rtn!=false) {

                        if (top.location != self.location) {
                            parent.layer.close(parent.layer.getFrameIndex(window.name));
                        } else {
                            window.close();
                        }
                    }
                });
            } else {
                var msg = result.msg;
                if(result.data!=""){
                    msg+="失败原因:"+result.data;
                }
                layer.alert(msg);
            }
        };

        form.on('submit(saveDraft)', function(data){
            if (isFormEmpty) {
                layer.alert("没有设置流程表单,无法保存！",{icon: 0,
                    skin: 'layui-layer-orange'});
                return
            }
            var rtn=beforeClick(6);
            if( rtn==false){
                return false;
            }
            setFormData(data);
            $.ajax({
                url: serverPath.workflowPath + setter.workflowLinkPath + "task/saveDraft",
                type: "post",
                dataType: 'json',
                data:data.field,
                success: function (result) {
                    showResponse(result,6);
                }
            });
            return false;
        });

        form.on('submit(saveData)', function(data){
            if (isFormEmpty) {
                layer.alert("没有设置流程表单,无法保存！",{icon: 0,
                    skin: 'layui-layer-orange'});
                return
            }
            var rtn=beforeClick(6);
            if( rtn==false){
                return false;
            }
            setFormData(data);
            $.ajax({
                url: serverPath.basePath + setter.workflowLinkPath +"task/saveFlowData",
                type: "post",
                dataType: 'json',
                data:data.field,
                success: function (result) {
                    showResponse(result,6);
                }
            });
            return false;
        });

        selExeUsers = function (obj,nodeId){
            var body;
            var userSelectorWin;
            var span = $(obj).parent().siblings("span");
            var selectUsers = [];
            var selectOthers = [];
            $(span).find('.layui-form-checked').each(function (i,item) {
                var val=$(item).prev().val();
                var array = val.split("^");
                var selectUser={
                    type:array[0],
                    id:array[1],
                    name:array[2]
                };
                if(selectUser.type==="user"){
                    selectUsers.push(selectUser);
                }else{
                    selectOthers.push(selectUser);
                }
            });
            layer.open({
                type: 2,
                title: "人员选择器",
                resize: false,
                area: ['980px', '630px'],
                btn:["保存","取消","撤销"],
                content: serverPath.systemPath + setter.sysLinkPath+"dialog/view/sysUserDialog",
                success: function(layero, index){
                    body = layer.getChildFrame('body',index);
                    userSelectorWin = window[layero.find('iframe')[0]['name']]; //得到iframe页的窗口对象，执行iframe页的方法：iframeWin.method();
                    userSelectorWin.layui.userList=[];
                    if(selectUsers.length>0){
                        for(var i=0;i<selectUsers.length;i++){
                            userSelectorWin.layui.userList.push({name:selectUsers[i].name,userId:selectUsers[i].id});
                        }
                    }
                },
                yes:function(index,layero){
                    var theUserList = body.find("input[name=userList]").val();
                    var aryTmp = [];
                    if (theUserList){
                        var userListParse = JSON.parse(theUserList);
                        if(userListParse.length<=0){
                            return;
                        }
                        layui.each(userListParse,function(index,item){
                            var html = "&nbsp;&nbsp;<input type=\"checkbox\" name=\""+nodeId+"_userId["+item.userId+"]\"  value=\"user^"+item.userId+"^"+item.name+"\" lay-skin=\"primary\" checked=\"checked\"/>"+item.name;
                            aryTmp.push(html);
                        });
                        if(selectOthers.length>0){
                            for(var i=0;i<selectOthers.length;i++){
                                var html = "&nbsp;&nbsp;<input type=\"checkbox\" name=\""+nodeId+"_userId["+selectOthers[i].id+"]\"  value=\""+selectOthers[i].type+"^"+selectOthers[i].id+"^"+selectOthers[i].name+"\" lay-skin=\"primary\" checked=\"checked\"/>"+selectOthers[i].name;
                                aryTmp.push(html);
                            }
                        }
                        span.html(aryTmp.join(''));
                        form.render('checkbox');
                    }
                    layer.close(index);

                },
                btn3:function(index, layero){
                    userSelectorWin.cancelData(index);
                    return false //开启该代码可禁止点击该按钮关闭
                }
            });
        };

    });
</script>
</body>
</html>